<template>
	<div id="box">
		<ul>
			<li class="mode">
				<mode></mode>
			</li>
			<li>
				<Hsum></Hsum>
			</li>
			<li>
				<allCategories></allCategories>
			</li>
		</ul>
	</div>
</template>

<script>
	import { mode, Hsum, allCategories } from '../index';
	export default {
		name: '',
		components: { Hsum, mode, allCategories },
		props: ['list'],
		data() {
			return {};
		},
	};
</script>
<style scoped>
	#box {
		height: 100%;

		ul {
			height: 100%;
			display: flex;
			flex-direction: column;
			list-style: none;
			li {
				width: 90%;
				flex: 7;
			}
			.mode {
				flex: 4;
			}
		}
	}
</style>
